<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Record Expense</title>
  <style>
    .header {
      text-align: right; /* 将信息对齐到右侧 */
      padding: 10px;
      background-color: #f3f3f3;
    }
  </style>
</head>
<body>
<!-- 页面顶部的用户信息展示 -->
<div class="header">
  Welcome, <span th:text="${username}">User</span>!
</div>

<!-- 费用记录表单 -->
<form th:action="@{/submitBill}" method="post">
  <div>
    <label for="amount">Amount:</label>
    <input type="number" id="amount" name="amount" required />
  </div>
  <div>
    <label for="category">Category:</label>
    <input type="text" id="category" name="category" required />
  </div>
  <div>
    <label for="tag">Tag:</label>
    <input type="text" id="tag" name="tag" required />
  </div>
  <div>
    <label for="description">Description:</label>
    <input type="text" id="description" name="description" required />
  </div>
  <div>
    <label for="date">Date:</label>
    <input type="date" id="date" name="date" required />
  </div>
  <div>
    <button type="reset">Reset</button>
    <button type="submit">Submit</button>
  </div>
</form>
</body>
</html>
